<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- 使用lable标签增大点击范围，提供用户体验。 -->
    <!-- 1、lable标签只包裹内容，不包裹表单控件，for属性值与id属性值相同。 -->
    <!-- <input type="checkbox"  id="grill">
    <label for="grill">烧烤</label> -->
    性别:<input  type="radio" id="man"> 
         <label for="man">男</label>
         <input  type="radio" id="woman"> 
         <label for="woman">女</label>
    <!-- 2、lable标签包裹表单控件和文字，不需要属性 -->
     <br>
     <br>
    性别:<label><input  type="radio"   id=" man">男</label>
         <label><input  type="radio"   id=" man">女</label>

</body>
</html>